// 为了兼容ie（不支持var和变量定义），需要重新设置默认样式
// 所以ie不支持动态改变主题

@mixin panel-primay() {
  color: var(--primary-dark-6);
  background-color: var(--primary-light-8);
  border-color: var(--primary-light-7);
}

a {
  @include link-primary();

  &.badge-primary {
    &:hover,
    &:focus {
      background-color: var(--primary-dark-1);
    }
    &:focus {
      box-shadow: $box-shadow-base;
    }
  }

  &.text-primary:focus,
  &.text-primary:hover {
    color: var(--primary-dark-2) !important;
  }
}

.btn-link,
.page-link {
  @include link-primary();
}
.page-link:focus {
  box-shadow: $box-shadow-base;
}
.page-item.active .page-link {
  background-color: var(--primary);
  border-color: var(--primary);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: var(--primary);
}

.bg-primary {
  background-color: var(--primary) !important;
}
.border-primary {
  border-color: var(--primary) !important;
}
.text-primary {
  color: var(--primary) !important;
}

.alert-primary {
  @include panel-primay();
  .alert-link {
    color: var(--primary-dark-9);
  }
  hr {
    border-top-color: var(--primary-light-6);
  }
}

.badge-primary {
  background-color: var(--primary);
}

.btn-default {
  @include btn-default();
}
.btn-primary {
  @include btn-primary();
}
.btn-outline-primary {
  color: var(--primary);
  border-color: var(--primary-dark-1);
  &:hover {
    color: #fff;
    color: var(--primary-text);
    background-color: var(--primary);
    border-color: var(--primary);
  }
  &:focus {
    box-shadow: $box-shadow-base;
  }
  &:not(:disabled):not(.disabled) {
    &:active,
    &.active {
      background-color: var(--primary-dark-3);
      border-color: var(--primary-dark-4);
      &:focus {
        box-shadow: $box-shadow-base;
      }
    }
  }
}

.form-control {
  &:focus {
    border-color: var(--primary-light-2);
    box-shadow: $box-shadow-base;
  }
}

.list-group-item.active {
  background-color: var(--primary);
  border-color: var(--primary);
}
.list-group-item-primary {
  @include panel-primay();
}

.el-progress-bar__inner {
  background-color: var(--primary);
}
